const { ccclass, property } = cc._decorator;

enum Time {
    touchstart = 1,
    touchmove = 2,
    touchend = 3,
    touchcancel = 4,
    click = 5
}

@ccclass
export default abstract class baseButtonTouch extends cc.Component {
    @property
    protected _target: cc.Node = null
    @property(cc.Node)
    get target() {
        if(this._target && !this._target.isValid){
            this._target = null;
        }
        return this._target || this.node;
    }
    set target(value) {
        const oldValue = this.target;
        this._target = value;
        if (oldValue !== this.target) {
            oldValue.removeComponent(cc.Button)
        }
        this.resetButton();
    }

    @property({
        visible: false
    })
    protected timeEvent: string = 'click';

    @property
    protected _time: Time = Time.click
    @property({ type: cc.Enum(Time) })
    get time() { return this._time; }
    set time(value) {
        this._time = value;
        this.timeEvent = Time[this.time];
        this.resetButton();
    }
    /**
     * !#en Color and Scale transition duration
     * !#zh 颜色过渡和缩放过渡时所需时间
     * @property {Number} duration
     */
    @property
    protected _duration: number = 0.1
    @property({
        range: [0, 10],
        tooltip: CC_DEV && 'i18n:COMPONENT.button.duration',
        visible(this: baseButtonTouch) {
            return this.time === Time.click;
        }
    })
    get duration() { return this._duration; }
    set duration(value) {
        this._duration = value;
        this.resetButton();
    }
    /**
     * !#en  When user press the button, the button will zoom to a scale.
     * The final scale of the button  equals (button original scale * zoomScale)
     * !#zh 当用户点击按钮后，按钮会缩放到一个值，这个值等于 Button 原始 scale * zoomScale
     * @property {Number} zoomScale
     */
    @property()
    protected _zoomScale: number = 1.1
    @property({
        tooltip: CC_DEV && 'i18n:COMPONENT.button.zoom_scale',
        visible(this: baseButtonTouch) {
            return this.time === Time.click;
        }
    })
    get zoomScale() { return this._zoomScale; }
    set zoomScale(value) {
        this._zoomScale = value;
        this.resetButton();
    }

    start() {
        this.resetButton();
    }

    private resetButton() {
        if (CC_EDITOR) return;
        const node = this.target || this.node;
        if (this.time === Time.click) {
            let btn = node.getComponent(cc.Button);
            if (!btn) {
                btn = node.addComponent(cc.Button);
                btn.transition = cc.Button.Transition.SCALE;
            }
            btn.duration = this.duration;
            btn.zoomScale = this.zoomScale;
        } else {
            node.removeComponent(cc.Button);
        }
    }
}
